<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1.0" />
		<title>关于我</title>
		<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet">
		<link href="static/css/index.css" rel="stylesheet" />
	</head>

	<body>
		<!--
        	作者：offline
        	时间：2019-09-19
        	描述：导航
        -->
		<!--<nav class="ui inverted attached segment i-padded-tb-mini i-shadow-small">
			<div class="ui container">
				<div class="ui inverted secondary stackable menu">
					<h2 class="ui teal header item">Blog</h2>
					<a href="#" class="i-item item i-mobile-hide"><i class="home mini icon"></i>首页</a>
					<a href="#" class="i-item item i-mobile-hide"><i class="idea mini icon"></i>分类</a>
					<a href="#" class="i-item item i-mobile-hide"><i class="tags mini icon"></i>标签</a>
					<a href="#" class="i-item item i-mobile-hide"><i class="tags mini icon"></i>归档</a>
					<a href="#" class="i-item item i-mobile-hide"><i class="info mini icon"></i>关于我</a>
					<div class="i-item right item i-mobile-hide">
						<div class="ui icon inverted transparent input">
							<input type="text" placeholder="Search...">
							<i class="search link icon"></i>
						</div>
					</div>
				</div>
			</div>
			<a href="#" class="ui menu toggle black button icon i-right-top i-mobile-show">
				<i class="sidebar icon"></i>
			</a>
		</nav>-->
		<div id="head"></div>
		<!--
        	作者：offline
        	时间：2019-09-19
        	描述：内容
        -->
		<div class="i-padded-tb-big i-container">
			<div class="ui container">
				<div class="ui stackable grid">
					<div class="eleven wide column">
						<div class="ui segment">
							<img class="ui rounded image" src="https://unsplash.it/800/600?image=1005" />
						</div>
					</div>

					<div class="five wide column">
						<div class="ui top attached segment">
							<div class="ui header">关于我</div>
						</div>
						<div class="ui attached segment">
							<p class="i-text">马翔，一个独立开发者，折腾在 0 和 1 世界的大叔；一个终身学习者，誓将学习无限循环. 希望结识可以共同成长的小伙伴.</p>
							<p class="i-text">热爱编程，喜欢折腾，正在探索高效学习编程技术的方法...</p>
						</div>
						<div class="ui attached segment">
							<div class="ui orange basic  label">编程</div>
							<div class="ui orange basic  label">写作</div>
							<div class="ui orange basic  label">思考</div>
							<div class="ui orange basic  label">运动</div>
						</div>
						<div class="ui bottom  attached segment">
							<div class="ui teal basic  label i-margin-tb-tiny">Java</div>
							<div class="ui teal basic  label i-margin-tb-tiny">JavaScript</div>
							<div class="ui teal basic  label i-margin-tb-tiny">AnglurJs</div>
							<div class="ui teal basic  label i-margin-tb-tiny">RN</div>
						</div>
						<div class="ui bottom attached segment">
							<a href="#" class="ui circular icon button icon"><i class="github icon"></i></a>
							<a href="#" class="ui wechat circular icon button icon"><i class="weixin icon"></i></a>
							<a href="#" class="ui qq circular icon button icon " data-content="1528560974" data-position="bottom center"><i class="qq icon"></i></a>
						</div>

						<div class="ui wechat_qr flowing popup transition hidden">
							<img class="ui rounded image" src="static/img/wechat.jpg" style="width: 100px;" />
						</div>

					</div>
				</div>
			</div>
		</div>
		<!--
        	作者：offline
        	时间：2019-09-19
        	描述：footer
        -->
		<div id="foot"></div>

	</body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
	<script src="static/js/function.js"></script>
	<script>
		$('.menu.toggle').click(function() {
			$('.i-item').toggleClass('i-mobile-hide');
		});

		$(".qq").popup();

		$(".wechat").popup({
			popup: $(".wechat_qr"),
			position: "bottom center"
		})
		$(function(){
			$('#head').load('common/head.html',null,function(){
				$('.navbarlist a').removeClass('active');
				$('.navbarlist a:eq(4)').addClass('active');
			});
			$('#foot').load('common/foot.html');
		})
	</script>

</html>